.bucket-add-data {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.bucket-add-data--option {
  border-radius: $ix-radius;
  background-color: $cf-grey-15;
  margin-bottom: $cf-space-3xs;
  padding: $cf-space-s;
  transition: background-color 0.25s ease;
}

.bucket-add-data--option-header,
.bucket-add-data--option-desc {
  transition: color 0.25s ease;
  user-select: none;
}

.bucket-add-data--option-header {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: $cf-space-xs;
  color: $cf-grey-75;
}

.bucket-add-data--option-desc {
  font-size: 13px;
  font-weight: 500;
  color: $cf-grey-65;
}

/*
  Hover State
*/
.bucket-add-data--option:hover {
  cursor: pointer;
  background-color: $cf-grey-25;

  .bucket-add-data--option-header {
    color: $cf-grey-95;
  }
  .bucket-add-data--option-desc {
    color: $cf-grey-75;
  }
}

.system-bucket {
  color: mix($c-honeydew, $cf-grey-75);
}
